<template>
   <el-dialog v-model="visibleForm" :title="`沟通记录`" width="760px" :close-on-click-modal="false"
   :close-on-press-escape="false" @close="close()">
      <section class="wrap">
        <el-form ref="queryFormRef" :inline="true">
          <el-form-item>
            <el-button type="primary" @click="handleCreateVisit">添加沟通记录</el-button>
          </el-form-item>
        </el-form>

        <el-table :data="page.list" v-loading="page.loading" element-loading-text="拼命加载中"
          element-loading-spinner="el-icon-loading" element-loading-background="rgba(0, 0, 0, 0.6)" ref="table"
          style="width: 100%">
          <!-- <el-table-column label="客户名称" prop="custName">
            <template >
              {{currentCustom.custName}}
            </template>
          </el-table-column>
          <el-table-column label="客户ID" prop="nickName">
            <template >
              {{props.currentRow.custID}}
            </template>
          </el-table-column>
          <el-table-column label="客户昵称" prop="custID">
            <template >
              {{props.currentRow.custID}}
            </template>
          </el-table-column>
          <el-table-column label="客户手机" prop="phoneNo">
            <template >
              {{props.currentRow.phone}}
            </template>
          </el-table-column> -->
          <el-table-column label="沟通记录" prop="visitInfo"></el-table-column>
          <el-table-column label="添加时间" prop="createAt">
            <template #default="scope">
              {{formatTimeText(scope.row.visitTime )}}
            </template>
          </el-table-column>
        </el-table>

        <editCustomVisit 
          v-if="showEditVisit"
          :custom="props.currentRow"
          :showDialog="showEditVisit"
          :currentRow="currentRow"
          @close="disVisibleForm"
          @success="setSuccess"
        >
        </editCustomVisit>
      </section>
  </el-dialog>
</template>
<script setup>
import { reactive, ref, watch, defineProps, defineEmits } from 'vue'
import { useRouter, useRoute} from "vue-router"
import moment from 'moment'
import {custVisitList } from '../api.js'

import editCustomVisit from './editCustomVisit.vue'

let props = defineProps({
  showDialog: Boolean,
  currentRow: Object
})

let visibleForm = ref(props.showDialog)

watch(() => props.currentRow.custID, (n, o) => {
  console.log(n)
}, {
  deep: true
})

let currentRow = reactive({})

let emit = defineEmits(['close', 'success'])

const formatTimeText = (time) => {
  if (time < 10000000000) {
    time = time * 1000
  }
  return moment(time).format('YYYY-MM-DD HH:mm:ss')
}

const route = useRoute()

const queryFormRef = ref(null)
const queryForm = reactive({
  custID: "",
  salesID: ""
})

if (route.query.custID) {
  queryForm.custID = route.query.custID
}

if (route.query.salesID) {
  queryForm.salesID = route.query.salesID
}

const page = reactive({
  list: [],
  total: 0,
  pageNum: 1,
  pageSize: 25,
  loading: false,
});
let showEditVisit = ref(false)

// 查询客服列表
const getList = async () => {
  const params = {
    salesID: props.currentRow.salesID,
    custID: props.currentRow.custID,
  }
  page.loading = true
  page.list = []
  const res = await custVisitList(params)
  if (0 === res.status) {
    if (res && res.data) {
      let result = res.data
      page.list = result
      page.total = res.data.length
    }
  }
  page.loading = false
}

const handleCreateVisit = () => {
  currentRow = {}
  showEditVisit.value = true
}

const close = () => {
  emit('close')
}

const disVisibleForm = () => {
  showEditVisit.value = false
}

const setSuccess = (id) => {
  getList()
}


getList()

</script>
<style lang="scss" scoped>
//@import url('./index.scss');
</style>